<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>超链接的样式设置、伪类</title>
    <style type="text/css">
        body {
            line-height: 2em;
        }
        .second-a a:link{
            text-decoration: none;
            color:black;
        }
        .second-a a:visited{
            text-decoration: underline;
            color:silver;
        }
        .second-a a:hover{
            color:lime;
        }
        .second-a a:active{
            color: #f00;
        }
        .second-a p:hover{
            color:rgb(255,0,0);
        }
        input:focus{
            background-color:yellow;
        }
        li:first-child{
            background-color: #ff0;
        }
    </style>
</head>
<body>
    <div>
        <a href="#" target="_self">默认样式 这是一个超链接</a>
        <p>段落1-1</p>
        <p>段落1-2</p>
    </div>
    <div class="second-a">
        <a href="demo5-1.html" target="_blank">设置了样式的 这是一个超链接</a>
        <p>段落2-1</p>
        <p>段落2-2</p>
    </div>

    <form>
        姓名: <input type="text" name="firstname" /><br>
        年龄: <input type="text" name="age" />
    </form>
    <ul>
        <li>第一个</li>
        <li>第二个</li>
        <li>第三个</li>
        <li>第四个</li>
        <li>第五个</li>
    </ul>
    <ol>
        <li>第一个</li>
        <li>第二个</li>
        <li>第三个</li>
        <li>第四个</li>
        <li>第五个</li>
    </ol>
</body>
</html>